import { BasicColumn, FormSchema } from '@apps/antd-admin/src/components/Table';
import { render } from '@apps/antd-admin/src/hooks/render/renderUtils';
import { h } from 'vue';
import { Tag } from 'ant-design-vue';

export const columns: BasicColumn[] = [
  {
    title: '卡种名称',
    dataIndex: 'goodsName',
    width: 150,
  },
  {
    title: '版本号',
    dataIndex: 'agreementVersion',
    width: 80,
  },
  {
    title: '是否使用',
    dataIndex: 'isUse',
    width: 100,
    customRender: ({ record }: Recordable) => {
      const isUseArray = [
        { label: '未使用', value: 0, color: '#666666' },
        { label: '已使用', value: 1, color: '#f60606' },
      ];
      const isUse: any = isUseArray.find((item) => item.value == record.isUse);
      if (isUse) {
        return h(Tag, { color: isUse.color }, () => isUse.label);
      }
      return '无';
    },
  },
  {
    title: '协议内容',
    dataIndex: 'agreement',
    width: 250,
    customRender: render.renderHtmlToText,
  },
  {
    title: '创建时间',
    dataIndex: 'createTime',
    width: 150,
  },
];

export const searchFormSchema: FormSchema[] = [];

export const formSchema: FormSchema[] = [
  {
    label: '主键',
    field: 'vipcardAgreementId',
    component: 'Input',
    required: false,
    show: false,
  },
  {
    label: '卡种名称',
    field: 'vipcardId',
    component: 'Input',
    required: true,
    show: false,
  },
  {
    label: '卡种名称',
    field: 'goodsName',
    component: 'Input',
    required: false,
    show: true,
    dynamicDisabled: true,
  },
  {
    label: '协议内容',
    field: 'agreement',
    component: 'TyEditor',
    required: true,
  },
  {
    label: '是否使用',
    field: 'isUse',
    component: 'Select',
    required: true,
    defaultValue: 1,
    dynamicDisabled: ({ model }) => {
      if (model.vipcardAgreementId) {
        return true;
      } else {
        return false;
      }
    },
    componentProps: {
      options: [
        { label: '不使用', value: 0 },
        { label: '使用', value: 1 },
      ],
    },
  },
];
